<template>
  <!-- 河长制综合评价 -->
  <div>
    <el-table
            :data="tableData"
            :span-method="objectSpanMethod"
            border
            style="width: 100%; margin: 10px;">
      <el-table-column
              prop="fLevelIndex"
              label="一级指标（目标层）"
              width="180">
      </el-table-column>
      <el-table-column
              prop="sLevelIndex"
              label="二级指标（准则层）">
      </el-table-column>
      <el-table-column
              prop="tLevelIndex"
              label="三级指标">
      </el-table-column>
      <el-table-column
              prop="remark"
              label="备注">
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
    export default {
        data(){
            return {
                tableData: [{
                    fLevelIndex: '河长制评价综合指标A',
                    sLevelIndex: '水质指标B1',
                    tLevelIndex: '水质成分指标C11',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '水质指标B1',
                    tLevelIndex: '水体感官指标C12',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '河道指标B2',
                    tLevelIndex: '违法及淤积指标(排污口、淤积面积、违章建筑、占挖河道、水违法事件处理)C21',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '河道指标B2',
                    tLevelIndex: '河道坡堤设施完好度C22',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '河道指标B2',
                    tLevelIndex: '河道水面及两岸保洁C23',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '政策落实及执行(管理机制)指标B3',
                    tLevelIndex: '组织机构及制度建立C31',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '政策落实及执行(管理机制)指标B3',
                    tLevelIndex: '河道整治日常跟踪制度建立情况C32',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '政策落实及执行(管理机制)指标B3',
                    tLevelIndex: '定期监测及上报信息C33',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '政策落实及执行(管理机制)指标B3',
                    tLevelIndex: '河道周边环境监管制度建立C34',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '政策落实及执行(管理机制)指标B3',
                    tLevelIndex: '落实河道管护责任制C35',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '治理指标B4',
                    tLevelIndex: '治理为案制定C41',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '治理指标B4',
                    tLevelIndex: '控源截污引水补源等工程(满分15)C42',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '资金指标B5',
                    tLevelIndex: '资金拨忖指标C51',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '资金指标B5',
                    tLevelIndex: '资金非违规使用指标C52',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '效果效益指标B6',
                    tLevelIndex: '控源截污效果指标C61',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '效果效益指标B6',
                    tLevelIndex: '生态效益指标C62',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '效果效益指标B6',
                    tLevelIndex: '社会效益指标C63',
                    remark: '',
                },{
                    fLevelIndex: '',
                    sLevelIndex: '效果效益指标B6',
                    tLevelIndex: '经济效益指标C64',
                    remark: '',
                }],
            }
        },
        created() {
        },
        methods:{
            objectSpanMethod({ row, column, rowIndex, columnIndex }) {
                if (columnIndex === 0) {
                    if (rowIndex % 18 === 0) {
                        return {
                            rowspan: 18,
                            colspan: 1
                        };
                    } else {
                        return {
                            rowspan: 0,
                            colspan: 0
                        };
                    }
                }
                if (columnIndex === 1) {
                    if (rowIndex  === 0) {
                        return {
                            rowspan: 2,
                            colspan: 1
                        };
                    }else if(rowIndex === 2){
                        return {
                            rowspan: 3,
                            colspan: 1
                        };
                    }else if(rowIndex === 5){
                        return {
                            rowspan: 5,
                            colspan: 1
                        };
                    }else if(rowIndex === 10){
                        return {
                            rowspan: 2,
                            colspan: 1
                        };
                    }else if(rowIndex === 12){
                        return {
                            rowspan: 2,
                            colspan: 1
                        };
                    }else if(rowIndex === 14){
                        return {
                            rowspan: 4,
                            colspan: 1
                        };
                    }else {
                        return {
                            rowspan: 0,
                            colspan: 0
                        };
                    }
                }
            }
        },
        mounted(){},
        updated(){},
        destroyed(){},
    }
</script>
<style scoped>

</style>